<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="./../../oldVue.js"></script>
</head>

<body>
    <div id="app">
        <h2>开始存钱</h2>
        <div>每月存 :￥{{ money }}</div>
        <div>存:{{ num }}个月</div>
        <div>总共存款: ￥{{ total }}</div>
        <button @click="getMoreMoney">{{arryList[0].name}}多存一点</button>
        <msg-tip :msginfo='msgText' :totalnum='total'></msg-tip>
    </div>

    <script>
        debugger;
        // 定义一个新组件
        var a =  {
            props:['msginfo', 'totalnum'],
            data: function () {
                return {
                    count: 0
                }
            },
            template: '<div>{{ msginfo }}存了￥{{ totalnum }}</div>'
        }
        

        var app = new Vue({
            el: '#app',
            components: { msgTip: a},
            beforeCreate() { },
            created() { },
            beforeMount() { },
            mounted: () => { },
            beforeUpdate() { },
            updated() { },
            beforeDestroy() { },
            destroyed() { },
            data: function () {
                return {
                    money: 100,
                    num: 12,
                    arryList: [{name:'子树'}],
                    msgText: "优秀的乃古："
                }
            },
            computed: {
                total() {
                    return this.money * this.num;
                }
            },
            methods: {
                getMoreMoney() {
                    this.money = this.money * 2
                    this.arryList.unshift({name: '大树'})
                }
            }
        })


 var arr = [
    {id: 1, name: '部门1', pid: 0},
    {id: 2, name: '部门2', pid: 1},
    {id: 3, name: '部门3', pid: 1},
    {id: 4, name: '部门4', pid: 3},
    {id: 5, name: '部门5', pid: 4},
]
// function getArryTree(lists,arry){
//     let list = lists || [];
//     arry.forEach((item, i) => {
//         item.children = []
//         list.push(item)
//         getArryTree(list,arry[i+1])
//     });
//     console.log(list)
// }

function getArryTree(list,arry,i){
    arry[i].children = []
        list.push(arry[i])
        if(i<arry.length){
            getArryTree(list,arry,i+1)
        }else{
            console.log(list)
        }
}
arr.forEach((item, i) => {
        getArryTree([],arr,i)
    });

// [
//     {
//         "id": 1,
//         "name": "部门1",
//         "pid": 0,
//         "children": [
//             {
//                 "id": 2,
//                 "name": "部门2",
//                 "pid": 1,
//                 "children": []
//             },
//             {
//                 "id": 3,
//                 "name": "部门3",
//                 "pid": 1,
//                 "children": [
//                     // 结果 ,,,
//                 ]
//             }
//         ]
//     }
// ]




    </script>

</body>

</html>